<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>我的报名</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="css/cui.css"/>
    <link rel="stylesheet" href="css/lib.css"/>
    <link rel="stylesheet" href="css/style.css"/>
</head>
<body>

<!-- 头部 -->
<section id="hd">
    <div class="hdl"><a onclick="history.back()" class="a-back"></a></div>
    <h3>我的报名</h3>
</section>
<!-- 头部 end-->


<!-- 主内容 -->
<section id="bd">

    <ul class="ul-list5">
        <li v-for="e,index in list">
            <!-- 倒计时 -->
            <div class="m-clock" v-html="e.count"></div>
            <!-- 倒计时 end-->
            <div class="pic"><a href=""><img src="img/pic6.jpg" alt=""></a></div>
            <div class="txt">
                <h3><a :href="'activity.html?activityid='+e.Id" v-text="e.title"></a></h3>
                <p v-text="e.time"></p>
                <p v-text="e.Position"></p>
                <a class="m-btn1" :href="'activity.html?activityid='+e.Id">查看详情</a>
            </div>
        </li>
    </ul>

</section>
<!-- 主内容 end-->


<script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="js/lib.js"></script>
<script src="http://cdn.bootcss.com/vue/2.2.6/vue.min.js"></script>
<script src="http://cdn.bootcss.com/axios/0.15.3/axios.min.js"></script>
<script src="js/axios-config.js"></script>
<script>
    var vm = new Vue({
        el: '#bd',
        data: {
            list: {}
        },
        method: {},
        created: function () {
            var _ = this;
            axios.student('/activity')
                .then(function (res) {
                    if (res.data.Code === 2) {
                        goLogin()
                    } else {
                        res.data.List.forEach(function (e) {
                            var start = new Date(e.StartTime);
                            var stop = new Date(e.StopTime);
                            start = (start.getMonth() + 1) + '月' + start.getDate() + '日 ' + (start.getHours()) + ':' + (start.getMinutes());
                            stop = (stop.getMonth() + 1) + '月' + stop.getDate() + '日 ' + (stop.getHours()) + ':' + (stop.getMinutes());
                            e.time = start + '~' + stop;
                            e.count=''
                        })
                        _.list = res.data.List;
                        function updateCount() {
                            _.list.forEach(function (e,index) {
                                var now = new Date().getTime();
                                var diff = (new Date(e.StopTime).getTime() - now) / 1000;
                                var second = Math.floor(diff % 60);
                                var minute = Math.floor(diff / 60 % 60);
                                var hour = Math.floor(diff / 60 / 60 % 24);
                                var day = Math.floor(diff / 60 / 60 / 24);
                                _.list[index].count = '剩余 <span>' + hour + '</span>时<span>' + minute + '</span>分<span>' + second + '秒</span> 结束';
                            })
                            setTimeout(updateCount,1000)
                        }
                        updateCount();
                    }
                })
        },
        mounted: function () {

        }
    })
</script>
</body>
</html>